<script>
export default {
  name: "headerCom",
  data(){
    return {
      num:0
    }
  },
  methods:{
    add(){
      this.num++
    }
  }
}
</script>

<template>
  <div>
    <header>
      这是头部组件
      {{num}}
      <button @click="add">点击</button>
    </header>
  </div>
</template>

<style scoped lang="less">
header {
  width: 1200px;
  margin: 0 auto;
  background-color: red;
  height: 300px;
}
</style>